<template>

  <div class="currency-list">
    <div class="arrow-with-text-container" >
      <div  @click="fanhui">
        <i class="el-icon-arrow-left back-icon"></i>
        <span class="back-text back-icon">返回</span>
      </div>

    </div>
    <h1>货币</h1>
    <ul >
      <li v-for="aaa in currencies" :key="aaa.id" @click="abc(aaa)" >
        <span class="country">{{aaa.country}}</span>
        <span class="currency-code" >{{aaa.currencyCode}}</span>
      </li>
    </ul>

  </div>
</template>

<script>
export default {
  data() {
    return {
      currencies: {},
      Dto:{},
      pageInfo:{},
    };
  },
  created() {
    this.findAll();
  },
  methods:{
    findAll(){
      this.axios.get('http://localhost:6001/api/world/findAll',).then(res => {
        this.currencies = res.data.data.list
      })
    },
    abc(a){
      sessionStorage.setItem("currency", JSON.stringify(a))
      console.log(a)
      this.$router.push("/shezhi")
      this.$router.go(0)
    },
    fanhui(){
      this.$router.push("/shezhi")
    }
  }
};
</script>

<style scoped>
.currency-list {
  font-family: Arial, sans-serif;
  text-align: center;
}

h1 {
  font-size: 24px;
  margin-bottom: 20px;
}

ul {
  list-style-type: none;
  padding: 0;
}

li {
  display: flex;
  justify-content: space-between;
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.country {
  font-weight: bold;
}

.currency-code {
  color: #555;
}.arrow-with-text-container {
   display: flex;
   align-items: center;
   /* 让元素左对齐 */
   justify-content: flex-start;
 }
</style>